<template>
  <!-- 预检 上检 报告 -->
  <view>
    <u-toast ref="uToast" />
    <view :class="[(isFixedTop) ? 'fixedTop' : '']" id="boxyj">
      <u-tabs-swiper ref="uTabs" :list="pirList" :current="current" @change="tabsChange" active-color="#333"
        inactive-color="#666" font-size="30" bar-width="60" bar-height="6" height="80" :is-scroll="false" swiperWidth="750"
        :active-item-style="tabActiveStyle" :bar-style="barActiveStyle"></u-tabs-swiper>
      <u-gap height="2" bg-color="#F6F6F6"></u-gap>
    </view>
    <!-- 预检 -->
    <view class="" v-show="swiperCurrent === 0" :class="[(isFixedTop) ? 'fixedTopyj' : '']">
      <view class="1234" v-if="carnameList !== ''">
        <view class="1234" v-for="(item,index) in carnameList.list" :key="index">
          <view class="listbox mt-20 padd mb_20">
            <view class="flex flex-jc-sb flex-ai-c mb_20">
              <view class="ltname font-36 color-333 font-bold">
                {{item.name}}
              </view>
              <view class="clickCollapse mr-5" v-show="item.chekd" @click="shtfclick(item,index)">
                <text class="mr-10 font-24">收起</text>
                <u-icon name="arrow-down" color="#9A9A9A" size="24rpx" class="iconszk"></u-icon>
              </view>
              <view class="clickCollapse mr-5" v-show="!item.chekd" @click="shtfclick(item,index)">
                <text class="mr-10 font-24">展开</text>
                <u-icon name="arrow-down" color="#9A9A9A" size="24rpx" class="iconszk"></u-icon>
              </view>
            </view>
            <view class="flex font-24 color-666">
              <view class="normal">
                正常 ({{item.normal}})
              </view>
              <view class="abnormal ml-25" v-if="item.abnormal !==0">
                异常 ({{item.abnormal}})
              </view>
              <view class="normal ml-25" v-if="item.didNotDetect !==0">
                未检测 ({{item.didNotDetect}})
              </view>
              <view class="normal ml-25" v-if="item.repairNum !==0">
                已修复 ({{item.repairNum}})
              </view>
              <view class="normal ml-25" v-if="item.noRepairNum !==0">
                未修复 ({{item.noRepairNum}})
              </view>
            </view>
            <view v-if="item.chekd" class="mt-20">
              <view class="content mb_15" v-for="(item1,index1) in item.carwg " :key="index1">
                <view class="flex flex-jc-sb">
                  <view class="font-28 color-333">
                    {{item1.name}}
                  </view>
                  <view class="1234">
                    <view v-if="item1.type===0">
                      <i-icon icon="iconexport" color="#999999"></i-icon>
                    </view>
                    <view v-if="item1.type===1">
                      <i-icon icon="icongouSolid" color="#70CD58"></i-icon>
                    </view>
                    <view v-if="item1.type===2">
                      <i-icon icon="icongantanhao" color="#FF4B44"></i-icon>
                    </view>
                    <view v-if="item1.type===3">
                      <text style="color: #70CD58;">有</text>
                    </view>
                    <view v-if="item1.type===4">
                      <text style="color: #FF4B44;">无</text>
                    </view>
                    <view class="1234">
                      {{item1.demand}}
                    </view>
                  </view>
                </view>
                <view class="coimgboxs flex flex-ai-c flex-jc-sb" v-if="item1.img !== ''">
                  <view class="mt-15">
                    <view class="">
                      <view v-if="item1.exceptionMsg !== ''">
                        <view class="abnormalname">{{item1.exceptionMsg}}</view>
                      </view>
                      <view v-else>
                        <text class="abnormalname">无</text>
                      </view>
                    </view>
                    <view class="mt-20" v-if="item1.img !==''" @click="bigimgList(item1.img)">
                      <image :src="item1.img" mode="heightFix"></image>
                    </view>
                  </view>
                  <view class="ml-35 mt-15 mr-50" v-if="item1.repairUrl">
                    <view class="repairname">
                      已修复照片
                    </view>
                    <view class="mt-20" @click="bigimgList(item1.repairUrl)">
                      <image :src="item1.repairUrl" mode="heightFix"></image>
                    </view>
                  </view>
                  <view v-else>
                    <!-- 客户已经签字就不可操作 -->
                    <view class="ml-35 flex flex-ai-c" v-if="!carnameList.account_Signature_Url">
                      <text class="font-28 color-999 mr-20" :style="item1.isClientAgree?'color:#41cb05':'color:#999999'">{{item1.repaname}}</text>
                      <u-switch v-model="item1.isClientAgree" active-color="#41CB05" inactive-color="#E1E1E1" size="34"
                        @change="checkedClick(item1.isClientAgree,index,index2)"></u-switch>
                    </view>
                    <view class="ml-35 flex flex-ai-c" v-else>
                      <text class="font-28 color-999 mr-20" :style="item1.isClientAgree?'color:#41cb05':'color:#999999'">{{item1.repaname}}</text>
                      <u-switch v-model="item1.isClientAgree" active-color="#41CB05" inactive-color="#E1E1E1" size="34"
                        disabled></u-switch>
                    </view>
                  </view>
                </view>
              </view>
            </view>
            <view class="" v-else>
              <view v-if="item.exceptionList.length !== 0" v-for="(item2,index2) in item.exceptionList" :key="index2">
                <view class="flex flex-ai-c flex-jc-sb">
                  <view class="1234 mt-20">
                    {{item2.name}}
                  </view>
                  <view>
                    <i-icon icon="icongantanhao" color="#FF4B44"></i-icon>
                  </view>
                </view>
                <view class="flex flex-ai-c flex-jc-c flex-jc-sb mt-20 mr-30">
                  <view class="">
                    <view class="abnormalname" v-if="item2.exceptionMsg !== ''">
                      {{item2.exceptionMsg}}
                    </view>
                    <view class="abimgs" @click="bigimgList(item2.img)">
                      <image :src="item2.img" mode="widthFix"></image>
                    </view>
                  </view>
                  <view class="ml-35" v-if="item2.repairUrl">
                    <view class="repairname">
                      已修复照片
                    </view>
                    <view class="abimgs" @click="bigimgList(item2.repairUrl)">
                      <image :src="item2.repairUrl" mode="widthFix"></image>
                    </view>
                  </view>
                  <view v-else>
                    <view class="ml-35 flex flex-ai-c" v-if="!carnameList.account_Signature_Url">
                      <text class="font-28 color-999 mr-20" :style="item2.isClientAgree?'color:#41cb05':'color:#999999'">{{item2.repaname}}</text>
                      <u-switch v-model="item2.isClientAgree" active-color="#41CB05" inactive-color="#E1E1E1" size="34"
                        @change="checkedClick(item2.isClientAgree,index,index2)"></u-switch>
                    </view>
                    <view class="ml-35 flex flex-ai-c" v-else>
                      <text class="font-28 color-999 mr-20" :style="item2.isClientAgree?'color:#41cb05':'color:#999999'">{{item2.repaname}}</text>
                      <u-switch v-model="item2.isClientAgree" active-color="#41CB05" inactive-color="#E1E1E1" size="34"
                        disabled></u-switch>
                    </view>
                  </view>

                </view>

                <u-gap height="2" bg-color="#F6F6F6"></u-gap>
              </view>
            </view>
          </view>
          <u-gap height="10" bg-color="#F6F6F6"></u-gap>
        </view>
        <view class="">
          <view class="padd">
            <view class="mt-30">
              维修技师签字：
            </view>
            <view class="confirm mt-45" v-if="!carnameList.technician_Signature_Url">
              等待技师签字
            </view>
            <view class="confirmimg" v-else>
              <image :src="carnameList.technician_Signature_Url" mode="heightFix"></image>
            </view>
          </view>
          <u-gap height="10" bg-color="#F6F6F6"></u-gap>
          <!-- 预检客户签字 -->
          <view class="padd">
            <view class="mt-30">
              客户签字：
            </view>
            <view class="confirm mt-45" @click="customerClickYj(carnameList.technician_Signature_Url)" v-if="!userWriteimg">
              点击进入签字
            </view>
            <view class="confirmimg" v-else>
              <image :src="userWriteimg" mode="heightFix"></image>
            </view>
          </view>
        </view>
        <view class="determine" @click="yjClick()" v-if="!carnameList.account_Signature_Url">
          <view class="dmname">
            确定
          </view>
        </view>
      </view>
      <view v-else>
        <!-- 默认图 -->
        <defaultImg :show="yjdefaultImg" msg="暂无记录"></defaultImg>
      </view>
    </view>
    <!-- 上检 -->
    <view class="list-wrapper" v-show="swiperCurrent === 1" :class="[(isFixedTop) ? 'fixedTopsj' : '']">
      <view :class="[(isFixedTop) ? 'fixedTopShj' : '']">
        <view class="tabboxs" v-if="!sjdefaultImg">
          <u-gap height="10" bg-color="#F6F6F6"></u-gap>
          <view class="servicetype flex flex-jc-sb">
            <view class="1234">
              服务类型：{{inspectionList.serviceType}}
            </view>
            <view class="1234">
              {{inspectionList.addTime}}
            </view>
          </view>
          <u-tabs v-if="swiperCurrent === 1" :list="instList" bar-width="60" bar-height="6" :is-scroll="false" height="60"
            :current="currenttwo" @change="tabsChangetwo" active-color="#333" inactive-color="#666" font-size="24"
            :active-item-style="tabInsStyle" :bar-style="barActiveStyle"></u-tabs>
        </view>
        <u-gap height="10" bg-color="#F6F6F6"></u-gap>
      </view>
      <view v-if="inspectionList !== ''">
        <view class="1234" v-if="showTab" v-for="(item,index) in inspectionList.list" :key="index">
          <view class="serboxs font-28 color-999">
            <view class="sernei flex flex-jc-sb">
              <view class="flex">
                <view class="1234">
                  检测项目
                </view>
                <view class="color-333 ml-35">
                  {{item.items}}
                </view>
              </view>
              <view class="color-666" v-if="item.type === 4">
                未检测项
              </view>
              <view class="color-666" v-if="item.type === 3">
                状态良好
              </view>
              <view class="color-FBB000" v-if="item.type === 2">
                建议处理
              </view>
              <view class="urgent" v-if="item.type === 1">
                紧急处理
              </view>
            </view>
            <view class="sernei flex flex-jc-sb">
              <view class="flex">
                <view class="1234">
                  检测标准
                </view>
                <view class="color-333 ml-35">
                  {{item.standard}}
                </view>
              </view>
              <view class="color-FBB000">
              </view>
            </view>
            <view class="sernei flex flex-jc-sb" v-if="item.type !== 3">
              <view class="flex">
                <view class="1234">
                  异常问题
                </view>
                <view class="color-333 ml-35">
                  {{item.abnormal}}
                </view>
              </view>
              <view class="color-FBB000">
              </view>
            </view>
            <view v-if="item.type !== 3" class="flex flex-ai-c flex-jc-sb">
              <view class="serimgs" v-if="item.abnormalimg !== ''" @click="bigimgList(item.abnormalimg)">
                <image :src="item.abnormalimg" mode="widthFix"></image>
              </view>
              <view class="ml-35 mr-60" v-if="item.repairUrl !== null">
                <view class="serimgs" @click="bigimgList(item.repairUrl)">
                  <image src="https://files.yzsheng.com/client/weixin/logo.png" mode="widthFix"></image>
                </view>
                <view class="repairname mt-25" style="margin-left: 20rpx;    position: absolute;">
                  已修复照片
                </view>
              </view>
              <view class="1234" v-else>
                <view class="ml-35 flex flex-ai-c mr-40" v-if="!inspectionList.account_Signature_Url">
                  <text class="font-28 color-999 mr-20" :style="item.isClientAgree?'color:#41cb05':'color:#999999'">{{item.repaname}}</text>
                  <u-switch v-model="item.isClientAgree" active-color="#41CB05" inactive-color="#E1E1E1" size="34"
                    @change="checkedClickSj(item.id,index)"></u-switch>
                </view>
                <view class="ml-35 flex flex-ai-c mr-40" v-else>
                  <text class="font-28 color-999 mr-20" :style="item.isClientAgree?'color:#41cb05':'color:#999999'">{{item.repaname}}</text>
                  <u-switch v-model="item.isClientAgree" active-color="#41CB05" inactive-color="#E1E1E1" size="34"
                    @change="checkedClickSj(item.id,index)" disabled></u-switch>
                </view>
              </view>
            </view>
            <view class="sernei flex flex-jc-sb mb_20" v-if="item.type !== 3">
              <view class="flex">
                <view class="1234">
                  处理建议
                </view>
                <view class="color-333 ml-35">
                  {{item.proposal}}
                </view>
              </view>
              <view class="color-FBB000">
              </view>
            </view>
            <u-gap height="24" bg-color="#F6F6F6"></u-gap>
          </view>
        </view>
        <view class="serboxs" v-if="weijiance">
          <view class="sernei flex flex-jc-sb">
            <view class="color-999">
              未检测项
            </view>
            <view class="color-666">
              未检测项
            </view>
          </view>
          <view class="contentbox" style="">
            <view class="color-333 pad-t-b-10" v-for="(item,index) in inspectionList.notDetect" :key="index">
              {{item}}
            </view>
          </view>
          <u-gap height="24" bg-color="#F6F6F6"></u-gap>
        </view>
        <view class="">
          <view class="padd" id="progrn">
            <view class="mt-30">
              维修技师签字：
            </view>
            <view class="confirm mt-45" v-if="!inspectionList.technician_Signature_Url">
              等待技师签字
            </view>
            <view class="confirmimg" v-else>
              <image :src="inspectionList.technician_Signature_Url" mode="heightFix"></image>
            </view>
          </view>
          <u-gap height="10" bg-color="#F6F6F6"></u-gap>
          <!-- 上检客户签字 -->
          <view class="padd">
            <view class="mt-30">
              客户签字：
            </view>
            <view class="confirm mt-45" @click="customerClick(inspectionList.technician_Signature_Url)" v-if="!userWriteimg">
              点击进入签字
            </view>
            <view class="confirmimg" v-else>
              <image :src="userWriteimg" mode="heightFix"></image>
            </view>
          </view>
        </view>
        <view class="determine" @click="yjClick()" v-if="!inspectionList.account_Signature_Url">
          <view class="dmname">
            确定
          </view>
        </view>
      </view>
      <view v-else>
        <!-- 默认图 -->
        <defaultImg :show="sjdefaultImg" msg="暂无记录"></defaultImg>
      </view>
    </view>
    <!-- 质检 -->
    <view class="" v-show="swiperCurrent === 2" :class="[(isFixedTop) ? 'fixedTopsj' : '']">
      <view :class="[(isFixedTop) ? 'fixedTopZhj' : '']">
        <view class="tabboxs" v-if="!zjdefaultImg">
          <u-gap height="10" bg-color="#F6F6F6"></u-gap>
          <view class="servicetype flex flex-jc-sb">
            <view class="1234">
              服务类型：{{ZJinspectionList.serviceType}}
            </view>
            <view class="1234">
              {{ZJinspectionList.addTime}}
            </view>
          </view>
          <u-tabs v-if="swiperCurrent === 2" :list="qirList" bar-width="60" bar-height="6" :is-scroll="false" height="60"
            :current="currentthree" @change="tabsChangethree" active-color="#333" inactive-color="#666" font-size="24"
            :active-item-style="tabInsStyle" :bar-style="barActiveStyle"></u-tabs>
        </view>
        <u-gap height="10" bg-color="#F6F6F6"></u-gap>
      </view>
      <view class="qireport" v-if="ZJinspectionList !== ''">
        <view class="qirboxone">
          <view class="" style="border-bottom: 1px solid #F6F6F6;padding-bottom: 40rpx;">
            <view class="flex">
              <view class="font-28 color-999">
                服务门店
              </view>
              <view class="font-28 color-333" style="margin-left: 50rpx;">
                {{ZJinspectionList.storeName}}
              </view>
            </view>
            <view class="flex mt-15">
              <view class="font-28 color-999">
                服务技师
              </view>
              <view class="font-28 color-333" style="margin-left: 50rpx;">
                {{ZJinspectionList.waiter}}
              </view>
            </view>
            <view class="flex mt-15">
              <view class="font-28 color-999">
                服务时间
              </view>
              <view class="font-28 color-333" style="margin-left: 50rpx;">
                {{ZJinspectionList.completeTime}}
              </view>
            </view>
          </view>
          <view class="qirimgs flex">
            <view class="qirboxs">
              <view class="font-28 color-999">
                服务质检
              </view>
              <view class="1234" style="margin: 20rpx 0rpx 0rpx 74rpx;">
                <view class="1234">
                  <image src="https://files.yzsheng.com/client/commodity/qualified.png"></image>
                </view>
                <view style="margin-top: 5rpx;">
                  检验合格
                </view>
              </view>
            </view>
            <view class="qirboxs">
              <view class="font-28 color-999">
                质检员
              </view>
              <view class="qiryimgtwo" @click="bigimgList(ZJinspectionList.technician_Signature_Url)">
                <image :src="ZJinspectionList.technician_Signature_Url" mode="heightFix"></image>
              </view>
            </view>
          </view>
        </view>
        <view class="zjiboxs mb_30">
          <view class="1234">
            质检照片
          </view>
          <view class="flex flex-ai-fe mt-20">
            <view class="zjimgs" @click="bigimgList2(0)">
              <image :src="zhijianimgs" mode="widthFix"></image>
            </view>
            <view class="ml-15 color-999 font-24">
              1/{{zhijiannum}}
            </view>
          </view>
        </view>
        <u-gap height="2" bg-color="#F6F6F6"></u-gap>
        <view class="qirboxtwo">
          <view class="1234" v-if="showTabTwo" v-for="(item,index) in ZJinspectionList.list" :key="index">
            <view class="serboxs bordpadd font-28 color-999">
              <view class="flex flex-ai-c flex-jc-sb mt-30">
                <view class="font-bold font-28 color-333">
                  {{item.position}}
                </view>
                <view class="Fixed" v-if="item.type === 1">
                  已修复
                </view>
                <view class="notfixed" v-if="item.type === 2">
                  未修复
                </view>
                <view class="noneedrepair" v-if="item.type === 3">
                  无需修复
                </view>
              </view>
              <view class="mb_30 flex flex-ai-fe">
                <view class="mt-20">
                  <text class="describe" v-if="item.exceptionMsg !==''">
                    {{item.exceptionMsg}}
                  </text>
                  <view class="desimgs" @click="bigimgList(item._img)">
                    <image :src="item._img" mode="widthFix"></image>
                  </view>
                </view>
                <view class="mt-20 ml-35" v-if="item.type === 1">
                  <text class="describe2">
                    已修复照片
                  </text>
                  <view class="desimgs" @click="bigimgList(item.repairUrl)">
                    <image :src="item.repairUrl" mode="widthFix"></image>
                  </view>
                </view>
              </view>
              <u-gap height="2" bg-color="#F6F6F6"></u-gap>
            </view>
          </view>
        </view>
      </view>
      <view v-else>
        <!-- 默认图 -->
        <defaultImg :show="zjdefaultImg" msg="暂无记录"></defaultImg>
      </view>
    </view>
    <!-- 交车报告 -->
    <view class="" v-show="swiperCurrent === 3" :class="[(isFixedTop) ? 'fixedTopyj' : '']">
      <view class="jcrebog" v-if="deliveryreportList">
        <!-- 交车报告预检 -->
        <view>
          <view class="flex flex-ai-c flex-jc-sb plr-30 mt-20" @click="yujianclick(0)">
            <view class="flex flex-ai-c">
              <view class="verticalline"></view>
              <view class="ml-10">
                预检
              </view>
            </view>
            <view class="1234">
              <u-icon name="arrow-right" color="#9A9A9A" size="24rpx" class="iconszk"></u-icon>
            </view>
          </view>
          <view class="ml-20 plr-30">
            <view class="border-bottom-1">
              <view class="flex font-28">
                <view class="mt-20 ">
                  <i-icon icon="icongantanhao" color="#FF4B44"></i-icon>
                </view>
                <view class="ml-20">
                  异常项目 <text class="font-bold plr-20" style="font-size: 48rpx;">{{deliveryreportyj.abnormal}}</text>
                  项
                </view>
              </view>
              <view class="flex pl-50 mt-20 mb_20 font-24">
                <view class="1234">
                  已修复 <text class="font-bold plr-10">{{deliveryreportyj.repairuccess}}</text> 项
                </view>
                <view class="ml-80">
                  未修复 <text class="font-bold plr-10">{{deliveryreportyj.repairFailure}}</text> 项
                </view>
              </view>
            </view>
            <view class="border-bottom-1">
              <view class="flex font-28 mt-20 mb_30">
                <view class="mt-20">
                  <i-icon icon="iconexport" color="#999999"></i-icon>
                </view>
                <view class="ml-20">
                  未检测项目 <text class="font-bold plr-20" style="font-size: 48rpx;">{{deliveryreportyj.didNotDetect}}</text>
                  项
                </view>
              </view>
            </view>
            <view class="border-bottom-1">
              <view class="flex font-28 mt-20 mb_30">
                <view class="mt-20">
                  <i-icon icon="icongouSolid" color="#70CD58"></i-icon>
                </view>
                <view class="ml-20">
                  正常项目 <text class="font-bold plr-20" style="font-size: 48rpx;">{{deliveryreportyj.normal}}</text>
                  项
                </view>
              </view>
            </view>
            <view class="flex flex-ai-c flex-jc-sb font-28 color-666 mt-20 mb_20">
              <view class="">
                客户签字
              </view>
              <view class="color-333" v-if="deliveryreportyj.signature">
                已签字确认
              </view>
              <view class="notfixed" v-else>
                待签字确认
              </view>
            </view>
          </view>
          <u-gap height="10" bg-color="#F6F6F6"></u-gap>
        </view>
        <!-- 交车报告上检 -->
        <view>
          <view class="flex flex-ai-c flex-jc-sb plr-30 mt-20" @click="yujianclick(1)">
            <view class="flex flex-ai-c">
              <view class="verticalline"></view>
              <view class="ml-10">
                上检
              </view>
            </view>
            <view class="1234">
              <u-icon name="arrow-right" color="#9A9A9A" size="24rpx" class="iconszk"></u-icon>
            </view>
          </view>
          <view class="ml-20 plr-30">
            <view class="border-bottom-1">
              <view class="flex font-28">
                <view class="mt-20 ">
                  <i-icon icon="icongantanhao" color="#FF4B44"></i-icon>
                </view>
                <view class="ml-20">
                  异常项目 <text class="font-bold plr-20" style="font-size: 48rpx;">{{deliveryreportsj.abnormal}}</text>
                  项
                </view>
              </view>
              <view class="flex pl-50 mt-20 mb_20 font-24">
                <view class="1234">
                  已修复 <text class="font-bold plr-10">{{deliveryreportsj.repairuccess}}</text> 项
                </view>
                <view class="ml-80">
                  未修复 <text class="font-bold plr-10">{{deliveryreportsj.repairFailure}}</text> 项
                </view>
              </view>
            </view>
            <view class="border-bottom-1">
              <view class="flex font-28 mt-20 mb_30">
                <view class="mt-20">
                  <i-icon icon="iconexport" color="#999999"></i-icon>
                </view>
                <view class="ml-20">
                  未检测项目 <text class="font-bold plr-20" style="font-size: 48rpx;">{{deliveryreportsj.didNotDetect}}</text>
                  项
                </view>
              </view>
            </view>
            <view class="border-bottom-1">
              <view class="flex font-28 mt-20 mb_30">
                <view class="mt-20">
                  <i-icon icon="icongouSolid" color="#70CD58"></i-icon>
                </view>
                <view class="ml-20">
                  正常项目 <text class="font-bold plr-20" style="font-size: 48rpx;">{{deliveryreportsj.normal}}</text>
                  项
                </view>
              </view>
            </view>
            <view class="flex flex-ai-c flex-jc-sb font-28 color-666 mt-20 mb_20">
              <view class="">
                客户签字
              </view>
              <view class="color-333" v-if="deliveryreportsj.signature">
                已签字确认
              </view>
              <view class="notfixed" v-else>
                待签字确认
              </view>
            </view>
          </view>
          <u-gap height="10" bg-color="#F6F6F6"></u-gap>
        </view>
        <!-- 交车报告质检 -->
        <view>
          <view class="flex flex-ai-c flex-jc-sb plr-30 mt-20" @click="yujianclick(2)">
            <view class="flex flex-ai-c">
              <view class="verticalline"></view>
              <view class="ml-10">
                质检
              </view>
            </view>
            <view class="1234">
              <u-icon name="arrow-right" color="#9A9A9A" size="24rpx" class="iconszk"></u-icon>
            </view>
          </view>
          <view class="ml-20 plr-30">
            <view class="border-bottom-1">
              <view class="flex font-28">
                <view class="mt-20 ">
                  <i-icon icon="icongantanhao" color="#FF4B44"></i-icon>
                </view>
                <view class="ml-20">
                  异常项目 <text class="font-bold plr-20" style="font-size: 48rpx;">{{deliveryreportzj.abnormal}}</text>
                  项
                </view>
              </view>
              <view class="flex pl-50 mt-20 mb_20 font-24">
                <view class="1234">
                  已修复 <text class="font-bold plr-10">{{deliveryreportzj.repairuccess}}</text> 项
                </view>
                <view class="ml-80">
                  未修复 <text class="font-bold plr-10">{{deliveryreportzj.repairFailure}}</text> 项
                </view>
              </view>
            </view>
          </view>
          <u-gap height="10" bg-color="#F6F6F6"></u-gap>
        </view>
        <!-- 交车报告-施工异常 （显示无操作） -->
        <view>
          <view class="flex flex-ai-c flex-jc-sb plr-30 mt-20">
            <view class="flex flex-ai-c">
              <view class="verticalline"></view>
              <view class="ml-10">
                施工异常
              </view>
            </view>
            <!-- <view class="1234">
              <u-icon name="arrow-right" color="#9A9A9A" size="24rpx" class="iconszk"></u-icon>
            </view> -->
          </view>
          <view class="ml-20 plr-30">
            <view class="border-bottom-1">
              <view class="flex font-28">
                <view class="mt-20 ">
                  <i-icon icon="icongantanhao" color="#FF4B44"></i-icon>
                </view>
                <view class="ml-20">
                  异常项目 <text class="font-bold plr-20" style="font-size: 48rpx;">{{deliveryreportshyc.abnormal}}</text>
                  项
                </view>
              </view>
              <view class="flex pl-50 mt-20 mb_20 font-24">
                <view class="1234">
                  已修复 <text class="font-bold plr-10">{{deliveryreportshyc.repairuccess}}</text> 项
                </view>
                <view class="ml-80">
                  未修复 <text class="font-bold plr-10">{{deliveryreportshyc.repairFailure}}</text> 项
                </view>
              </view>
            </view>
            <view class="flex flex-ai-c flex-jc-sb font-28 color-666 mt-20 mb_20">
              <view class="">
                客户签字
              </view>
              <view class="color-333" v-if="deliveryreportshyc.signature">
                已签字确认
              </view>
              <view class="notfixed" v-else>
                待签字确认
              </view>
            </view>
          </view>
          <u-gap height="10" bg-color="#F6F6F6"></u-gap>
        </view>
        <view class="qirboxtwo">
          <view class="">
            <!-- 交车报告客户签字 -->
            <view class="padd">
              <view class="mt-30">
                客户签字：
              </view>
              <view class="confirm mt-45" @click="customerClick(deliveryreportList.technician_signature_url,false)"
                v-if="!userWriteimg">
                点击进入签字
              </view>
              <view class="confirmimg" v-else>
                <image :src="userWriteimg" mode="heightFix"></image>
              </view>
            </view>
          </view>
          <view class="determine" @click="yjClick()" v-if="!deliveryreportList.account_signature_url">
            <view class="dmname">
              确定
            </view>
          </view>
        </view>
      </view>
      <view v-else>
        <!-- 默认图 -->
        <defaultImg :show="zjdefaultImg" msg="暂无记录"></defaultImg>
      </view>
    </view>
    <!-- 弹窗 -->
    <view class="uni-popup" v-if="shenjlaji">
      <view class="main">
        <view class="heades">
          温馨提示
        </view>
        <view class="jiangchuli">
          您有需要修复的异常选项未开启
        </view>
        <view class="popup-footer flex">
          <view class="disagreeBtn" @tap="contentBtn(0)">继续签字</view>
          <view class="fanhuishouy" @tap="contentBtn(1)">去开启</view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
  import defaultImg from '@/components/defaultImg/defaultImg.vue' //默认图片组件
  export default {
    components: {
      defaultImg
    },
    props: {
      tabindex: {
        type: [Number, String],
        default: 0
      },
      inspectstate: {
        type: [Number, String],
        default: 0
      },
      orderStoreId: {
        type: String,
        default: ''
      },
      isFixedTop: {
        type: Boolean,
        default: false
      }
    },
    watch: {},
    data() {
      return {
        Topdistance: 3000,
        current: 0,
        currenttwo: 0,
        currentthree: 0,
        swiperCurrent: 0,
        userWriteimg: '',
        tabActiveStyle: {
          'font-weight': 'bold',
          'font-size': '32rpx'
        },
        tabInsStyle: {
          'font-weight': 'bold',
          'font-size': '24rpx'
        },
        barActiveStyle: {
          'background': 'linear-gradient(0deg, #FBB000, #FFE23E)'
        },
        pirList: [{
          carid: 0,
          name: '预检',
        }, {
          carid: 1,
          name: '上检',
        }, {
          carid: 1,
          name: '质检',
        }, {
          carid: 1,
          name: '交车报告',
        }],
        showTab: false,
        scrollTop: 0,
        old: {
          scrollTop: 0
        },
        instList: [{
          carid: 0,
          name: '全部',
        }, {
          carid: 1,
          name: '紧急处理',
        }, {
          carid: 2,
          name: '建议处理',
        }, {
          carid: 3,
          name: '状态良好',
        }, {
          carid: 4,
          name: '未检测项',
        }, {
          carid: 5,
          name: '检测确认',
        }],
        isHeight: 0,
        isHeighthree: 0,
        tabTop: false, // tab吸顶时触发的开关
        tabToptwo: false, // tab吸顶时触发的开关
        tabTopThree: false, // tab吸顶时触发的开关
        carnameList: {}, //预检list
        inspectionList: {}, //上检list
        ZJinspectionList: {}, //质检list
        qirList: [{
          carid: 0,
          name: '全部',
        }, {
          carid: 1,
          name: '已修复',
        }, {
          carid: 2,
          name: '未修复',
        }, {
          carid: 3,
          name: '无需修复',
        }],
        showTabTwo: false,
        weijiance: false,
        yjdefaultImg: false, //默认图
        sjdefaultImg: false, //默认图
        zjdefaultImg: false, //默认图
        repaList: [],
        shenjlaji: false,
        content: '您有需要修复的异常选项未开启',
        yigeurlimg: '',
        zhijianimgs: '',
        zhijiannum: 0,
        deliveryreportList: [], //交车报告
        deliveryreportyj: [], //交车报告
        deliveryreportsj: [], //交车报告
        deliveryreportzj: [] ,//交车报告
        deliveryreportshyc: [] //交车报告
      }
    },
    created() {
      this.current = this.tabindex //列表进来
      this.swiperCurrent = this.current
      if (this.tabindex === 0) {
        this.repaList = []
        this.GetYJList()
      }
      if (this.tabindex === 1) {
        this.showTab = true
        this.repaList = []
        this.GetSJList()
      } else {
        this.showTab = false
      }
      if (this.tabindex === 2) {
        this.showTabTwo = true
        this.GetZJList()
      } else {
        this.showTabTwo = false
      }
      if (this.tabindex === 3) {
        this.GetReport()
      }

      let that = this
      uni.$on('userConfirm', function(data) {
        that.$nextTick(function() {
          that.userWriteimg = data.userName
        })
      })
    },
    methods: {
      //预检接口
      async GetYJList() {
        try {
          let data = {
            order_Arrive_Store_Id: this.orderStoreId
          }
          const res = await this.$api.commodity.GetYJList(data)
          if (res.data === '') {
            this.yjdefaultImg = true
          }
          this.carnameList = res.data
          this.carnameList.list.forEach(item => {
            item.chekd = false
          })
          this.carnameList.list.forEach(item => {
            item.exceptionList.forEach(item2 => {
              if (item2.isClientAgree) {
                item2.repaname = '需要修复'
              } else {
                item2.repaname = '无需修复'
              }
              if (item2.orderId !== null) {
                item2.repaname = '修复中...'
              }
            })
            item.carwg.forEach(item3 => {
              if (item3.isClientAgree) {
                item3.repaname = '需要修复'
              } else {
                item3.repaname = '无需修复'
              }
              if (item3.orderId !== null) {
                item3.repaname = '修复中...'
              }
            })

          })
          this.userWriteimg = this.carnameList.account_Signature_Url
        } catch (e) {
          console.log(e)
        }
      },
      // 收起展开
      shtfclick(item, index) {
        let listbox = [] //暂存赋值
        this.carnameList.list.forEach((item, i) => {
          if (i === index) {
            if (item.chekd === false) {
              item.chekd = true
            } else {
              item.chekd = false
            }
          }
          listbox.push(item)
        })
        this.carnameList.list = listbox
      },
      // 是否需要修复
      checkedClick(type, index, index2) {
        let listbox = [] //暂存赋值
        this.carnameList.list[index].exceptionList.forEach((item, i) => {
          if (i === index2) {
            if (item.isClientAgree === false) {
              item.repaname = '无需修复'
              this.repaList.forEach((item2, j) => {
                if (item.id === item2) {
                  this.repaList.splice(j, 1)
                }
              })
            } else {
              item.repaname = '需要修复'
              var dataname = []
              dataname = item.id
              this.repaList.forEach(item3 => {
                if (item.id === item3) {
                  return false
                }
              })
              // 需求修复的id数组—反与后台
              this.repaList.push(dataname)
            }
          }
          listbox.push(item)
        })
        this.carnameList.list[index].exceptionList = listbox
        console.log('this.repaList', this.repaList)
      },
      //上检接口
      async GetSJList(type) {
        var types = this.currenttwo
        try {
          let data = {
            order_Arrive_Store_Id: this.orderStoreId,
            state: types
          }
          const res = await this.$api.commodity.GetSJList(data)
          if (res.data !== '') {
            res.data.addTime = res.data.addTime.split('T')[0]
            this.inspectionList = res.data
            this.userWriteimg = this.inspectionList.account_Signature_Url
            if (this.inspectionList.notDetect.length === 0) {
              this.weijiance = false
            } else {
              this.weijiance = true
            }
            // 置底
            if (type === 5) {
              setTimeout(() => {
                uni.pageScrollTo({
                  scrollTop: 99999999999
                })
              }, 200)
            }
          } else {
            this.sjdefaultImg = true
            this.inspectionList = res.data
          }
          this.inspectionList.list.forEach(item => {
            if (item.isClientAgree) {
              item.repaname = '需要修复'
            } else {
              item.repaname = '无需修复'
            }
            if (item.orderId !== null) {
              item.repaname = '修复中...'
            }
          })
        } catch (e) {
          console.log(e)
        }
      },
      // 从评论区域回到顶部
      backthetop(index) {
        uni.createSelectorQuery().select('#progrn').boundingClientRect(data => { //目标位置的节点：类或者id
          uni.createSelectorQuery().select('.list-wrapper').boundingClientRect(res => { //最外层盒子的节点：类或者id
            var number = data.top - res.top - 257
            console.log(number)
            uni.pageScrollTo({
              duration: 200, //过渡时间
              scrollTop: number, //到达距离顶部的top值
            })
          }).exec()
        }).exec()
      },
      checkedClickSj(type, index) {
        let listbox = [] //暂存赋值
        this.inspectionList.list.forEach((item, i) => {
          if (i === index) {
            if (item.isClientAgree === false) {
              item.repaname = '无需修复'
              this.repaList.forEach((item1, j) => {
                if (item.id === item1) {
                  this.repaList.splice(j, 1)
                }
              })
            } else {
              item.repaname = '需要修复'
              var dataname = []
              dataname = item.id
              this.repaList.forEach(item3 => {
                if (item.id === item3) {
                  return false
                }
              })
              // 需求修复的id数组—反与后台
              this.repaList.push(dataname)
            }
          }
          listbox.push(item)
        })
        this.inspectionList.list = listbox
        // console.log(this.repaList)
      },
      //质检接口
      async GetZJList() {
        try {
          let data = {
            order_Arrive_Store_Id: this.orderStoreId,
            state: this.currentthree
          }
          const res = await this.$api.commodity.GetZJList(data)
          if (res.data !== '') {
            res.data.addTime = res.data.addTime.split('T')[0]
            res.data.completeTime = res.data.completeTime.split('T')[0]
            this.ZJinspectionList = res.data
            this.userWriteimg = this.ZJinspectionList.account_Signature_Url
            this.zhijianimgs = this.ZJinspectionList.inspection_Urls[0]
            this.zhijiannum = this.ZJinspectionList.inspection_Urls.length
          } else {
            this.zjdefaultImg = true
            this.ZJinspectionList = res.data
          }
        } catch (e) {
          console.log(e)
        }
      },
      //交车报告接口
      async GetReport() {
        try {
          let data = {
            order_Arrive_Store_Id: this.orderStoreId,
          }
          const res = await this.$api.commodity.GetReport(data)
          this.deliveryreportList = res.data
          this.deliveryreportyj = res.data.yj
          this.deliveryreportsj = res.data.sj
          this.deliveryreportzj = res.data.inspection
          this.deliveryreportshyc = res.data.sg
          this.userWriteimg = res.data.account_signature_url
        } catch (e) {
          console.log(e)
        }
      },

      // tabs通知swiper切换
      tabsChange(index) {
        this.current = index
        this.swiperCurrent = index;

        if (this.current === 0) {
          this.currenttwo = 0
          this.currentthree = 0
          this.GetYJList()
        }
        if (this.current === 1) {
          this.showTab = true
          this.currenttwo = 0
          this.currentthree = 0
          this.GetSJList()
        } else {
          this.showTab = false
        }
        if (this.current === 2) {
          this.showTabTwo = true
          this.currenttwo = 0
          this.currentthree = 0
          this.GetZJList()
        } else {
          this.showTabTwo = false
        }
        if (this.current === 3) {
          this.currenttwo = 0
          this.currentthree = 0
          this.GetReport()
        }
      },
      // 预检客户签字
      customerClickYj(url, datafalse) {
        if (this.repaList.length === 0) {
          if (datafalse === false) {
            this.shenjlaji = false
          } else {
            this.shenjlaji = true
            this.yigeurlimg = url
            return false
          }
        }
        if (url === null) {
          this.$refs.uToast.show({
            title: '等待技师签字',
            icon: false,
            type: 'warning',
          })
          return
        }
        uni.navigateTo({
          url: '/pages_common/signature/signature'
        })
      },
      //客户签字
      customerClick(url, datafalse) {
        if (url === null) {
          this.$refs.uToast.show({
            title: '等待技师签字',
            icon: false,
            type: 'warning',
          })
          return
        }
        uni.navigateTo({
          url: '/pages_common/signature/signature'
        })
      },
      //预检确定
      yjClick() {
        this.AddSignature(this.userWriteimg)
      },
      contentBtn(type) {
        if (type) {
          this.shenjlaji = false
        } else {
          this.customerClickYj(this.yigeurlimg, false)
        }
      },
      //预检上检质检签字保存
      async AddSignature(type) {
        var types
        types = this.current
        if (this.current === 3) {
          types = 2
        }
        try {
          let data = {
            order_Arrive_Store_Id: this.orderStoreId,
            type: types,
            figure: 1,
            url: this.userWriteimg,
            exceptionIds: this.repaList
          }
          const res = await this.$api.commodity.AddSignature(data)
          if (res.code === 200) {
            if (this.current === 0) {
              this.GetYJList()
            }
            if (this.current === 1) {
              this.GetSJList()
            }
            if (this.current === 3) {
              this.GetReport()
            }
          }

        } catch (e) {
          console.log(e)
        }
      },
      //上检切换
      tabsChangetwo(e) {
        // console.log(123, e)
        this.currenttwo = e
        this.GetSJList(e)
      },
      //质检交车报告
      tabsChangethree(e) {
        // console.log(456123, e)
        this.currentthree = e
        this.GetZJList()
      },
      bigimgList(itemurl) {
        // 预览图片多张
        // previewImg(0) {
        let imgsArray = []
        imgsArray.push(itemurl)
        // #ifdef MP
        uni.previewImage({
          current: 0,
          urls: imgsArray,
          indicator: 'number',
          loop: true
        })
        // #endif
        // #ifndef MP
        uni.previewImage({
          current: 0,
          urls: imgsArray,
          indicator: 'number',
          loop: true
        })
        // #endif
      },
      bigimgList2(index) {
        // 预览图片多张
        // previewImg(index) {
        let imgsArray = []
        for (let i = 0; i < this.ZJinspectionList.inspection_Urls.length; i++) {
          if (this.ZJinspectionList.inspection_Urls[i] !== '') {
            imgsArray.push(this.ZJinspectionList.inspection_Urls[i])
          }
        }
        // #ifdef MP
        uni.previewImage({
          current: index,
          urls: imgsArray,
          indicator: 'number',
          loop: true
        })
        // #endif
        // #ifndef MP
        uni.previewImage({
          current: index,
          urls: imgsArray,
          indicator: 'number',
          loop: true
        })
        // #endif
      },

      yujianclick(type) {
        this.current = type
        this.swiperCurrent = type;
        if (type === 0) {
          this.currenttwo = 0
          this.currentthree = 0
          this.GetYJList()
        }
        if (type === 1) {
          this.showTab = true
          this.currenttwo = 0
          this.currentthree = 0
          this.GetSJList()
        } else {
          this.showTab = false
        }
        if (type === 2) {
          this.showTabTwo = true
          this.currenttwo = 0
          this.currentthree = 0
          this.GetZJList()
        } else {
          this.showTabTwo = false
        }
      }

    }
  }
</script>

<style lang="scss" scoped>
  .fixedTop {
    position: fixed;
    top: 150rpx;
    /* #ifdef H5 */
    top: 235rpx;
    /* #endif */
    left: 0;
    right: 0;
    z-index: 9999;
    background: #FFFFFF;
  }

  .fixedTopyj {
    margin-top: 235rpx;
  }

  .fixedTopShj {
    position: fixed;
    top: 230rpx;
    /* #ifdef H5 */
    top: 310rpx;
    /* #endif */
    left: 0;
    right: 0;
    z-index: 9999;
  }

  .fixedTopZhj {
    position: fixed;
    top: 230rpx;
    /* #ifdef H5 */
    top: 310rpx;
    /* #endif */
    left: 0;
    right: 0;
    z-index: 9999;
  }

  .fixedTopsj {
    margin-top: 340rpx;
  }


  .padd {
    padding: 0rpx 24rpx 0rpx 24rpx;
  }

  .scrolly {
    height: 78vh;
  }

  .scrollytwo {
    height: 78vh;
  }

  .scrollythree {
    height: 78vh;
  }

  .abnormal {
    padding: 0rpx 14rpx;
    height: 38rpx;
    background: #FEF1F0;
    border-radius: 5rpx;
    text-align: center;
    line-height: 38rpx;
    color: #FF4B44;
  }

  .normal {
    padding: 0rpx 14rpx;
    height: 38rpx;
    background: #EEEEEE;
    border-radius: 5rpx;
    text-align: center;
    line-height: 38rpx;
  }

  .coimgboxs {
    // width: 290rpx;
    // height: 180rpx;
    // border-radius: 10rpx;

    image {
      width: 290rpx;
      height: 180rpx;
      border-radius: 10rpx;
    }
  }

  .confirm {
    font-size: 48rpx;
    color: #EEEEEE;
    text-align: center;
    margin-top: 60rpx;
    margin-bottom: 100rpx;
  }

  .determine {
    background-color: #F6F6F6;
    height: 200rpx;
    padding: 50rpx 24rpx 0rpx 24rpx;

    .dmname {
      height: 88rpx;
      background: linear-gradient(0deg, #FBD220, #FFE23E);
      border-radius: 44rpx;
      font-size: 30rpx;
      color: #333333;
      text-align: center;
      line-height: 88rpx;
    }
  }

  .tabboxs {
    /deep/ .u-tabs {
      background-color: #F6F6F6 !important;
    }
  }

  .servicetype {
    font-size: 24rpx;
    color: #333333;
    background-color: #F6F6F6;
    padding: 0rpx 32rpx;
    height: 30rpx;
  }

  .bordpadd {
    padding: 0rpx 32rpx !important;
  }

  .serboxs {
    padding: 30rpx 0rpx 0rpx 0rpx;

    .sernei {
      padding: 0rpx 30rpx 20rpx 30rpx;
    }

    .serimgs {
      margin-left: 30rpx;
      width: 290rpx;
      height: 180rpx;
      background: #C8C8C8;
      border-radius: 10rpx;
      overflow: hidden;
      margin-bottom: 20rpx;

      image {
        width: 290rpx;
        height: 180rpx;
      }
    }

    .urgent {
      color: #FF4B44;
    }
  }

  .contentbox {
    margin-left: 180rpx;
    margin-top: -70rpx;
  }

  // 质检交车报告
  .qireport {
    .qirboxone {
      padding: 33rpx;
    }

    .qirimgs {
      margin-top: 30rpx;

      .qirboxs {
        width: 50%;

        image {
          width: 122rpx;
          height: 122rpx;
        }

        .qiryimgtwo {
          width: 249rpx;
          height: 200rpx;
          overflow: hidden;

          image {
            width: 249rpx;
            height: 200rpx;
          }
        }
      }
    }
  }

  .abnormalname {
    width: 320rpx;
    background: #FEF1F0;
    border-radius: 5rpx;
    line-height: 46rpx;
    padding: 0rpx 22rpx;
    font-size: 24rpx;
    color: #FF4B44;
  }

  .abimgs {
    width: 290rpx;
    height: 180rpx;
    border-radius: 10rpx;
    motion: 0 auto;
    overflow: hidden;
    margin-top: 26rpx;
    margin-bottom: 32rpx;

    image {
      width: 290rpx;
      height: 180rpx;
    }
  }

  .repairname {
    width: 165rpx;
    height: 46rpx;
    background: #EAF6E7;
    border-radius: 5rpx;
    line-height: 46rpx;
    text-align: center;
    padding: 0rpx 22rpx;
    font-size: 24rpx;
    color: #4FA539;
  }

  // 弹框
  .uni-popup {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.3);
    display: flex;
    align-items: center;
    /*定义body的元素垂直居中*/
    justify-content: center;
    /*定义body的里的元素水平居中*/
    z-index: 9999;

    .main {
      background-color: #fff;
      border: #f00;
      border-radius: 20rpx;
      width: 600rpx;
      margin: auto;
      padding: 50rpx;

      .heades {
        text-align: center;
        font-size: 36rpx;
        font-family: PingFang SC;
        font-weight: 500;
        color: #000000;
      }

      .jiangchuli {
        line-height: 60rpx;
        font-size: 30rpx;
        font-family: PingFang SC;
        font-weight: 500;
        color: #333333;
        padding: 30rpx 0rpx;
        text-align: center;
      }

      .neirong {
        font-size: 26rpx;
        font-family: PingFang SC;
        font-weight: 500;
        color: #666666;
        line-height: 50rpx;
        margin-top: 20rpx;
      }

      .popup-footer {
        .jkhjkh {
          width: 468rpx;
          height: 88rpx;
          background: linear-gradient(0deg, #FBD220, #FFE23E);
          border-radius: 44rpx;
          margin-top: 40rpx;

          text-align: center;
          line-height: 88rpx;
          font-size: 30rpx;
          font-family: PingFang SC;
          font-weight: 500;
          color: #3D3D3D;
        }

        .disagreeBtn {
          width: 260rpx;
          height: 88rpx;
          background: #333333;
          border-radius: 44rpx 0px 0px 44rpx;

          font-size: 28rpx;
          font-family: PingFang SC;
          font-weight: 500;
          color: #FFE23E;
          text-align: center;
          line-height: 88rpx;
        }

        .fanhuishouy {
          width: 260rpx;
          height: 88rpx;
          background: linear-gradient(0deg, #FBD220, #FFE23E);
          border-radius: 0px 44rpx 44rpx 0px;

          font-size: 30rpx;
          font-family: PingFang SC;
          font-weight: 500;
          color: #333333;
          text-align: center;
          line-height: 88rpx;
        }
      }
    }
  }

  /deep/ uni-button:after {
    border: none;
  }

  .zjiboxs {
    padding: 0rpx 32rpx;
  }

  .zjimgs {
    width: 290rpx;
    height: 180rpx;
    border-radius: 10rpx;
    overflow: hidden;

    image {
      width: 290rpx;
      height: 180rpx;
    }
  }

  .describe {
    height: 46rpx;
    background: #FEF1F0;
    border-radius: 5rpx;
    text-align: center;
    line-height: 46rpx;
    padding: 5rpx 23rpx;
    font-size: 24rpx;
    color: #FF4B44;
  }

  .describe2 {
    width: 170rpx;
    height: 46rpx;
    background: #EAF6E7;
    border-radius: 5rpx;
    text-align: center;
    line-height: 46rpx;
    padding: 5rpx 23rpx;
    font-size: 24rpx;
    color: #4FA539;
  }

  .desimgs {
    width: 290rpx;
    height: 180rpx;
    border-radius: 10rpx;
    overflow: hidden;
    margin-top: 16rpx;

    image {
      width: 290rpx;
      height: 180rpx;
    }
  }

  .Fixed {
    font-size: 28rpx;
    color: #54BC00;
  }

  .notfixed {
    font-size: 28rpx;
    color: #FF4B44;
  }

  .noneedrepair {
    font-size: 28rpx;
    color: #999999;
  }

  // 交车报告
  .jcrebog {
    // padding: 20rpx 32rpx;
  }

  .verticalline {
    width: 6rpx;
    height: 26rpx;
    background: linear-gradient(0deg, #FBB000, #FFE23E);
    border-radius: 3rpx;
  }
</style>
